import { proxy } from 'valtio'
import { watch } from 'valtio/utils'

interface CurrentState {
  id?: string
  panelMode: 'edit' | 'code' | 'preview'
  code: string
  theme: 'light' | 'dark'
  componentName?: string
  moduleName?: string
}

export const currentState: CurrentState = proxy({
  id: undefined,
  componentName: undefined,
  moduleName: undefined,
  panelMode: 'edit',
  code: '',
  theme: 'light',
})

watch((get) => {
  get(currentState)
  if (!currentState.id) {
    currentState.componentName = undefined
    currentState.moduleName = undefined
  }
})
